<!--显示查询方式-->
<template>
  <el-dropdown @command="handleCommand" @visible-change="mychange">
    <span class="el-dropdown-link">
      {{findKindDict[model.useKind].name}}
      <el-icon v-show="!isUp">
        <arrow-down-bold style="color:#ec9146;width: 1.0em; height: 1.0em; margin-right: 8px;margin-top: 4px;"/>
      </el-icon>
      <el-icon v-show="isUp">
        <arrow-right-bold style="color:#ec9146;width: 1.0em; height: 1.0em; margin-right: 8px;" />
      </el-icon>
    </span>
    <template #dropdown>
      <el-dropdown-menu>
        <el-dropdown-item
          v-for="kindId in model.findKind"
          :key="'s_kind_'+ kindId"
          :command="kindId"
          >
            {{findKindDict[kindId].name}}
          </el-dropdown-item>
      </el-dropdown-menu>
    </template>
  </el-dropdown>
</template>

<script>
  import { defineComponent, ref } from 'vue'
  import { ElDropdown, ElDropdownMenu, ElIcon, ElDropdownItem } from 'element-plus'
  import { findKindDict } from '../../map'
  import { ArrowDownBold, ArrowRightBold } from '@element-plus/icons-vue'

// 查询方式的 select
export default defineComponent({
  name: 'el-find-kind',
  components: {
    ElDropdown, ElDropdownMenu, ElIcon, ElDropdownItem,
    ArrowDownBold,
    ArrowRightBold
  },
  props: {
    model: Object // 查询对象
  },
  setup (props, context) {
    // console.log('props-查询方式：', props)
    const findModel = props.model // 可用的查询方式，选择的查询方式，查询值

    // 控制向下的箭头
    const isUp = ref(false)
    let oldValue = null
    const handleCommand = (command) => {
      findModel.useKind = command // findKindDict[command].name
      isUp.value = true

      if (command === 417) {
        
      }
      oldValue = command
    }

    const mychange = (val) => {
      isUp.value = val
    }

    return {
      isUp,
      findKindDict, // 查询方式的字典
      mychange, // 展开收拢的事件
      handleCommand // 选择查询方式的事件
    }
  }
})
</script>

<style>
  .el-dropdown-link {
    cursor: pointer;
    color: #409EFF;
  }
  .el-icon-arrow-down {
    font-size: 12px;
  }
</style>
